
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:untitled1/app/res/myColors.dart';

/**
 * 文字选择器，选中字体加黑，变大，变粗，底部有红色横线
 */
class TextSelector extends StatefulWidget {

  final List<String> options;
  final ValueChanged<int> onTap;
  var selectedIndex=0;

   TextSelector({
    Key? key,
    required this.options,
    required this.onTap,
    this.selectedIndex=0,
  }) : super(key: key);

  @override
  State<TextSelector> createState() => _TextSelectorState();
}

class _TextSelectorState extends State<TextSelector> {
  int selectedIndex = 0;
  @override
  void initState() {
    super.initState();
    selectedIndex = widget.selectedIndex;
  }

  // 可自定义的选项列表
  // final List<String> options = ['推荐', '热门', '最新', '关注'];

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          height: 50,
          decoration: const BoxDecoration(
            color: Colors.white,
            boxShadow: [
              // BoxShadow(//阴影
              //   color: Colors.black12,
              //   blurRadius: 4,
              //   offset: Offset(0, 2),
              // )
            ],
          ),
          child: Row(
            children: List.generate(widget.options.length, (index) {
              final isSelected = index == selectedIndex;
              return Expanded(
                child: GestureDetector(
                  onTap: () {
                    setState(() {
                      selectedIndex = index;
                      widget.onTap(selectedIndex);
                      print(">]selectedIndex=${selectedIndex} ");
                    });
                  },
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      AnimatedDefaultTextStyle(//动画文字
                        duration: const Duration(milliseconds: 0),
                        style: TextStyle(
                          fontSize: isSelected ? 16 : 14,
                          fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                          color: isSelected ? myColors.c_191919 : myColors.c_707070,
                        ),
                        child: Text(widget.options[index]),
                      ),
                      const SizedBox(height: 6),
                      Container(
                        height: 3,
                        width: 20,
                        decoration: BoxDecoration(
                          color: isSelected ? Colors.red : Colors.transparent,
                          borderRadius: BorderRadius.circular(1.5),
                        ),
                      ),
                    ],
                  ),
                ),
              );
            }),
          ),
        ),

      ],
    );
  }
}